<nz-spin nzTip="Loading..." [nzSpinning]="submitting">
  <div *ngIf="!isPermission" class="center">
    <input
      nz-input
      [placeholder]="$t('_inputAuthCode')"
      [(ngModel)]="authCode"
      autofocus
    />
    <button
      class="mt10"
      nz-button
      nzType="primary"
      (click)="handleSubmitAuthCode()"
      [nzLoading]="submitting"
    >
      {{ $t('_save') }}
    </button>
    <div class="mt10">
      <p>成为VIP可享受全站功能，支持作者稳定持续开发，感谢您的支持</p>
      <p>
        发送到: xjh22222228&#64;gmail.com （备注开通域名，Github
        ID，我们会在24小时内发送授权码给您邮箱）
      </p>
      <div>
        <img
          src="https://cdn.jsdelivr.net/gh/xjh22222228/public@gh-pages/nav/support.png"
          style="width: 800px; border-radius: 16px; pointer-events: none"
          draggable="false"
        />
      </div>
      <img
        src="https://cdn.jsdelivr.net/gh/xjh22222228/public@gh-pages/img/32.png"
        width="600"
      />
    </div>
  </div>

  <div *ngIf="isPermission">
    <div class="mb10 mt10">
      绑定域名，多个以逗号分隔，不要带协议如：example.com,xjh22222228.github.io
    </div>
    <input nz-input placeholder="example.cn,example.com" [(ngModel)]="url" />
    <button
      nz-button
      nzType="primary"
      (click)="handleSave()"
      [nzLoading]="submitting"
      class="mt10"
    >
      {{ $t('_save') }}
    </button>
    <button
      nz-button
      nzType="primary"
      nzDanger
      (click)="logoutAuthCode()"
      [nzLoading]="submitting"
      class="mt10 ml10"
    >
      {{ $t('_logoutAuthCode') }}
    </button>
  </div>
</nz-spin>
